<template>
	<view v-if="person">
		<view style="background-color: #fff;padding: 50px 0 10px;">
			<u-icon name="checkmark-circle-fill" :label="(vote.btn_txt||'投票') + '成功'" labelPos="bottom" space="20"
				labelSize="18" color="#5ac725" labelColor="#000" size="120" v-if="code == 1"></u-icon>
			<u-icon name="info-circle-fill" :label="msg" labelPos="bottom" space="20" labelSize="18" color="#fa3534"
				labelColor="#fa3534" size="100" v-if="code == 0"></u-icon>
		</view>

		<u-text :text="vote.name" size="16" align="center" lineHeight="70"></u-text>

		<view class="vs-detail">
			<text>{{ person.code }}号 {{ person.name }}目前</text>
			<text :class="color+'-color'" style="margin: 0 10px;font-size: 16px;">{{ person.count }}</text>
			票
		</view>

		<!-- #ifdef MP-WEIXIN -->
		<view class="ad">
			<ad :unit-id="ad.vote_result_banner" v-if="ad.vote_result_banner" ad-intervals="30"></ad>
		</view>
		
		<view class="vs-share"><button openType="share" :class="color+'-bg'">邀请好友为ta{{vote.btn_txt||'投票'}}</button>
		</view>

		<view class="vs-btn">
			<view @tap="poster" :class="color+'-bg'"><text>生成海报</text></view>
			<view @tap="back" :class="color+'-bg'"><text>继续{{vote.btn_txt||'投票'}}</text></view>
		</view>
		
		<view class="vs-share" v-if="vote.award_status == 1 && ad.vote_jl">
			<button @tap="award" style="background-color:#5ac725;color: #fff;margin-top: 20px;">
				{{vote.award_btn_name||'看视频票数+'+vote.award_num}}</button>
		</view>
		
		<view class="ad">
			<ad :unit-id="ad.vote_result_video" ad-type="video" ad-theme="white" v-if="ad.vote_result_video"></ad>
		</view>
		<!-- #endif -->
		
		<!-- #ifdef H5 -->
		<view class="vs-share"><button @tap="back" :class="color+'-bg'">继续{{vote.btn_txt||'投票'}}</button>
		</view>
		<!-- #endif -->

	</view>
</template>

<script>
	import {
		mapGetters
	} from 'vuex';
	export default {
		computed: {
			...mapGetters({
				imgUrl: 'common/cdnurl',
				color: 'common/color',
				color_value: 'common/color_value',
				ad: 'common/ad',
			})
		},
		data() {
			return {
				person: null,
				person_id: 0,
				vote: null,
				code: null,
				msg: ''
			};
		},
		onLoad: function(options) {
			this.utils.hideShare()
			this.person_id = options.person_id;
			this.code = options.code;
			this.msg = options.msg;
			this.http('person/detail', {
				id: options.person_id
			}, 'get').then(res => {
				this.person = res.data.person;
				this.vote = res.data.person.vote;
				// #ifdef MP-WEIXIN
				this.adUtils.cp.load('result_cp')
				uni.$u.mpShare = {
					title: this.person.name,
					path: '/pages/vote/person?person_id=' + this.person_id,
					imageUrl: this.imgUrl + this.person.image,
				}
				// #endif
				this.utils.share({
					title: this.person.name,
					imgUrl: this.imgUrl + this.person.image,
				})
			});
		},
		onShow() {
			if (getApp().globalData.audio) {
				getApp().globalData.audio.destroy();
				getApp().globalData.audio = null;
			}
		},
		methods: {
			goto(url) {
				this.utils.goto(url)
			},

			back() {
				this.utils.goback()
			},
			poster() {
				this.utils.goto('/pages/poster/poster?type=person&id=' + this.person_id)
			},
			award() {
				let that = this;
				uni.showModal({
					title: '温馨提示',
					content: that.vote.award_msg ? that.vote.award_msg : '观看广告，选手票数+' + that.vote.award_num,
					success(res) {
						if (res.confirm) {
							// 激励广告
							that.adUtils.jl.load(that.ad.vote_jl, () => {
								//这里写你的任意奖励事件
								that.http('person/vote', {
									vote_id: that.vote.id,
									person_id: that.person.id,
									type: 2
								}, 'post').then(res => {
									uni.$u.toast(res.msg)
								});
							});
						}
					}
				})

			}
		}
	};
</script>

<style>
	page {
		background: #ffffff;
	}

	.vs-detail {
		font-size: 28rpx;
		margin-bottom: 38rpx;
		text-align: center;
	}


	.vs-share {
		width: calc(100% - 80rpx);
		margin: 0 auto;
		position: relative;
		margin-top: 10px;
	}

	.vs-share button {
		font-size: 14px;
		height: 80rpx;
		line-height: 80rpx;
		border-radius: 40rpx;
	}


	.vs-share text {
		font-size: 14px;
		color: #fff;
		line-height: 100rpx;
	}

	.vs-btn {
		display: flex;
		justify-content: space-between;
		width: calc(100% - 80rpx);
		margin: 38rpx auto 0;
		box-sizing: border-box;
	}

	.vs-btn>view {
		display: inline-block;
		width: calc(50% - 25rpx);
		height: 80rpx;
		line-height: 80rpx;
		text-align: center;
		border-radius: 40rpx;
	}

	.vs-btn text {
		font-size: 14px;
	}
</style>
